
<!-- 新闻中心 -->
<template>
  <div class="abb-page">
    <div>
      <img
        src="https://duxinggj-1251133427.cos.ap-guangzhou.myqcloud.com/dxgjAdmin/userImg/logo1658470349386.png"
      />
    </div>

    <div class="banhhweer">
      <n-carousel show-arrow>
        <div class="carousel-img" v-for="(item, idx) in bannerse" :key="idx">
          <img :src="item.toutu" />
          <div class="pd pt20">
            <p class="fz32">{{ item.title }}</p>
            <p class="fz24">阅读详情</p>
          </div>
        </div>
      </n-carousel>
    </div>
    <div class="mt70">
      <p class="fz26 bbm">
        <span class="title-context act">要闻</span>
      </p>
      <div class="pt50">
        <div class="display-flex">
          <div class="flex-1 mr20">
            <p class="fz26 mb20 b">公司新闻</p>
            <div>
              <div
                class="display-flex fz22 knseertrw mb20 pr"
                v-for="(item, idx) in xwList"
                :key="idx"
              >
                <span class="lkjnksjde">{{ getDateTim(item.teqian) }}</span>
                <p class="flex-1">
                  {{ item.title }}
                </p>
                <div class="kjnmkjewerrrw vertical-center">
                  <i
                    class="iconfont dx-shanchu sz cf fz40"
                    @click="xiugfai(item.id, '', 1)"
                  ></i>
                </div>
              </div>
              <n-button type="primary" @click="addnewwen(1)"
                >点击添加公司新闻</n-button
              >
            </div>
          </div>
          <div class="flex-1 ml20">
            <p class="fz26 mb20 b">业务新闻</p>
            <div>
              <div
                class="display-flex fz22 knseertrw mb20 pr"
                v-for="(item, idx) in ywxwList"
                :key="idx"
              >
                <span class="lkjnksjde">{{ getDateTim(item.teqian) }}</span>
                <p class="flex-1">
                  {{ item.title }}
                </p>
                <div class="kjnmkjewerrrw vertical-center">
                  <i
                    class="iconfont dx-shanchu sz cf fz40"
                    @click="xiugfai(item.id, '', 2)"
                  ></i>
                </div>
              </div>
              <n-button type="primary" @click="addnewwen(2)"
                >点击添加业务新闻</n-button
              >
            </div>
          </div>
        </div>
      </div>
    </div>

    <div class="mt70">
      <p class="fz26 bbm">
        <span class="title-context act">媒体资源</span>
      </p>

      <div class="mt20">
        <abbskip type="1" puptitle="媒体资源"></abbskip>
      </div>
    </div>
    <n-modal v-model:show="showModal" preset="card" style="width: 1200px">
      <template #header>
        <div>
          {{ typelie == 1 ? "公司新闻" : "业务新闻" }}
        </div>
      </template>
      <div>
        <list :pup="'' + typelie" @callBack="listCall" ref="lisPupfun"></list>
      </div>
      <template #action>
        <div class="tr">
          <n-button @click="showModal = false"> 取消 </n-button>
        </div>
      </template>
    </n-modal>
  </div>
</template>
 <script lang='ts' setup>
import { dxget, dialog, dxdel, dxpost } from "../../../util";
import { ref } from "vue";
import abbskip from "./components/abbskip.vue";
import list from "./list.vue";
const bannerse = ref();
const showModal = ref(false);
const typelie = ref(1);
const xwList = ref(); // 公司新闻
const ywxwList = ref(); // 公司新闻
let lisPupfun = ref();
const getBanner = async () => {
  const { data }: any = await dxget("abb/abbnewsManagement", {
    bannertr: 1,
  });
  bannerse.value = data;
};
const getxw = async (type) => {
  const { data }: any = await dxget("abb/abbnewsManagement", {
    homepageRecommendation: type,
  });
  if (type == 1) {
    xwList.value = data;
  }
  if (type == 2) {
    ywxwList.value = data;
  }
};
const getDateTim = (data) => {
  return data.split("|")[2];
};

const xiugfai = async (id, homepageRecommendation, lx) => {
  const res = await dxpost(
    "abb/abbnewsManagement",
    { id, homepageRecommendation },
    "PUT"
  );
  getxw(lx);
};

getBanner();
getxw(1);
getxw(2);
// 点击添加公司新闻
const addnewwen = (type) => {
  lisPupfun = ref();
  showModal.value = true;
  typelie.value = type;
};
const listCall = () => {
  showModal.value = false;
  getxw(1);
  getxw(2);
};
</script>
 <style scoped>
.carousel-img {
  width: 100%;

  object-fit: cover;
}
.carousel-img img {
  width: 100%;
  height: 680px;
  object-fit: cover;
}
.lkjnksjde {
  width: 190px;
}
.knseertrw {
  color: #888;
}
.knseertrw .flex-1 {
  text-decoration: underline;
}
.kjnmkjewerrrw {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: none;
}
.knseertrw:hover .kjnmkjewerrrw {
  display: flex;
}
</style>